<template>
	<view class="warp">
		<view class="status_bar" style="background-color: #FFF;">
			<!-- 这里是状态栏 -->
		</view>
		<view style="width: 100%;display: flex;justify-content: space-between; box-sizing: border-box;padding: 12rpx 16rpx;background-color: #FFF;align-items: center;" >
			<view style="display: flex;justify-content: space-between;align-items: center; box-sizing: border-box;">
				<view style="width: 72rpx;" @click="goBack">
					<view style="border: 2rpx solid #E5E6E8;border-radius: 24rpx;">
						<image style="width: 36rpx;height: 36rpx;margin: 16rpx 16rpx 4rpx;" src="/static/images/icon/left-icon.png"></image>
					</view>
				</view>
			</view>
			<view>
				<view style="font-size: 32rpx;color: #232426;margin-left: 16rpx;font-weight: 500;">{{title}}</view>
			</view>
			<view style="display: flex;justify-content: flex-end;box-sizing: border-box;">
				<view @click="openServiceFn" style="display: flex;align-items: center;justify-content: center;" >
					<image
						src="/static/images/icon/tools/Icon@2x(8).png"
						style="width:44rpx;height: 44rpx;"
					></image>
				</view>
				<view @click="goChat" style="display: flex;align-items: center;justify-content: center;margin:0 18rpx 0 36rpx;" >
					<image
						src="/static/images/icon/message.png"
						style="width:44rpx;height: 44rpx;"
					></image>
				</view>
			</view>
		</view>
		<view style="margin-top: 16rpx;background-color: #FFF;">
			<view v-if="type == 1" style="display: flex;justify-content: center;">
				<view 
					:class="{ 'menu-left-active': menu == 1, 'menu-left': menu == 2 }" 
					@click="changeMenu(1)"
				>
					我接的單
				</view>
				<view 
					:class="{ 'menu-right-active': menu == 2, 'menu-right': menu == 1 }"
					@click="changeMenu(2)"
				>
					我搶的單
				</view>
			</view>
			<view v-else style="display: flex;justify-content: center;">
				<view
					:class="{ 'menu-left-active': menu == 1, 'menu-left': menu == 2 }" 
					@click="changeMenu(1)"
				>
					我的預約
				</view>
				<view
					:class="{ 'menu-right-active': menu == 2, 'menu-right': menu == 1 }"
					@click="changeMenu(2)"
				>
					我的任務 
				</view>
			</view>
			
			<view style="display: flex; justify-content: space-between;margin-top: 32rpx;padding: 0 24rpx;">
				<view>
					<view :class="{'type-item-active':status==1,'type-item':status!=1}" @click="changeStatus(1)">
						待確認
					</view>
				</view>
				<view>
					<view :class="{'type-item-active':status==2,'type-item':status!=2}" @click="changeStatus(2)">
						進行中
					</view>
				</view>
				<view>
					<view :class="{'type-item-active':status==3,'type-item':status!=3}" @click="changeStatus(3)">
						待評價
					</view>
				</view>
				<view>
					<view :class="{'type-item-active':status==4,'type-item':status!=4}" @click="changeStatus(4)">
						完成/取消
					</view>
				</view>
			</view>
		</view>
		<view style="padding: 32rpx 24rpx;" v-if="type == 1 && menu == 1">
			<view v-for="(item, index) in order_list" :key="index">
				<view style="background-color: #FFF;border-radius: 16rpx;padding: 28rpx 32rpx;margin-bottom: 24rpx;" @click="goDetails(item.orderid)">
					<view style="display: flex;justify-content: space-between;align-items: center;">
						<view style="display: flex;justify-content: flex-start;align-items: center;">
							<view>
								<u-image
									:src="item.avatar"
									width="44rpx"
									height="44rpx"
									radius="50%"
								></u-image>
							</view>
							<view style="font-size: 32rpx;font-weight: 500;margin-left: 12rpx;">{{item.nickname}}</view>
							<view style="color: #F67914;background-color: #FFF0D8;font-size: 24rpx;padding:2rpx 10rpx;border-radius: 52rpx;margin-left: 12rpx;">
								{{item.rate}}
							</view>
						</view>
						<view>
							<!-- -2已退款, -1已取消，0待付款，1待确认，2待服務，3服務中，4待評價, 5完成 -->
							<view v-if="item.status == 0" style="color: #FFA514;background-color: rgba(255, 165, 20, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == -1" style="color: #6A707C;background-color: #F0F0F0;font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == 1" style="color: #266C9A;background-color: #EDF5FF;font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == 2" style="color: #78C629;background-color: rgba(120, 198, 41, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == 3" style="color: #FFA514;background-color: rgba(255, 165, 20, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else style="color: #378CFC;background-color: rgba(55, 140, 252, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
						</view>
					</view>
					<view style="display: flex;justify-content: flex-start;align-items: center;margin-top: 20rpx; ">
						<view>
							<u-icon name="clock" color="#6A707C" size="32rpx"></u-icon>
						</view>
						<view style="margin-left: 24rpx;">
							<view style="color: #6A707C;font-size: 26rpx;">{{item.created_at}}</view>
						</view>
					</view>
					<view style="display: flex;justify-content: flex-start;align-items: center;margin-top: 20rpx; ">
						<view>
							<u-image
								src="/static/images/icon/expert.png"
								width="32rpx"
								height="32rpx"
							></u-image>
						</view>
						<view style="margin-left: 24rpx;">
							<view style="color: #6A707C;font-size: 26rpx;width: 440rpx;white-space: nowrap; overflow: hidden;text-overflow: ellipsis">{{item.title}}</view>
						</view>
					</view>
					<view style="display: flex;justify-content: space-between;align-items: center;margin-top: 20rpx; ">
						<view style="display: flex;justify-content: flex-start;align-items: center;">
							<view>
								<u-image
									src="/static/images/icon/menu-circle.svg"
									width="32rpx"
									height="32rpx"
								></u-image>
							</view>
							<view style="color: #6A707C;font-size: 26rpx;margin-left: 24rpx;">
								{{item.orderid}}
							</view>
						</view>
						<view style="color: #232426 ;font-size: 28rpx;margin-left: 24rpx;font-weight: 510;">
							${{item.price}}
						</view>
					</view>
				</view>
			</view>
			<view v-if="order_list.length == 0">
				<view style="width: 100%;margin-top: 500rpx;">
					<view style="color: #232426;font-size: 28rpx;text-align: center;">目前沒有任何預約</view>
					<view @click="goBack" style="margin: 36rpx auto;border: 2rpx solid #E5E6E8;border-radius: 200rpx;color: #232426;width: 170rpx;height: 50rpx;line-height: 50rpx; text-align: center;font-size: 28rpx;background-color: #FFF;">
						回首頁
					</view>
				</view>
			</view>
		</view>
		<view v-else-if="type == 1 && menu == 2" style="padding: 32rpx 24rpx;" >
			<view v-for="(item, index) in order_list" :key="index">
				<view style="background-color: #FFF;border-radius: 16rpx;padding: 28rpx 32rpx;margin-bottom: 24rpx;" @click="goDetails(item.orderid)">
					<view style="display: flex;justify-content: space-between;align-items: center;">
						<view style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width: 80%;">
							{{item.title}}
						</view>
						<view>
							<view v-if="item.status == 0" style="color: #FFA514;background-color: rgba(255, 165, 20, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == -1" style="color: #6A707C;background-color: #F0F0F0;font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == 1" style="color: #266C9A;background-color: #EDF5FF;font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == 2" style="color: #78C629;background-color: rgba(120, 198, 41, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == 3" style="color: #FFA514;background-color: rgba(255, 165, 20, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else style="color: #378CFC;background-color: rgba(55, 140, 252, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
						</view>
					</view>
					<view style="display: flex;justify-content: flex-start;align-items: center;margin-top: 20rpx; ">
						<view>
							<u-image
								:src="item.avatar"
								width="32rpx"
								height="32rpx"
								radius="50%"
							></u-image>
						</view>
						<view style="font-size: 26rpx;margin-left: 24rpx;color: #6A707C;">{{item.nickname}}</view>
						<view style="color: #F67914;background-color: #FFF0D8;font-size: 24rpx;padding:2rpx 10rpx;border-radius: 52rpx;margin-left: 12rpx;">
							{{item.rate}}
						</view>
					</view>
					<view style="display: flex;justify-content: flex-start;align-items: center;margin-top: 20rpx; ">
						<view>
							<u-icon name="clock" color="#6A707C" size="32rpx"></u-icon>
						</view>
						<view style="margin-left: 24rpx;">
							<view style="color: #6A707C;font-size: 26rpx;">{{item.created_at}}</view>
						</view>
					</view>
					<view style="display: flex;justify-content: space-between;align-items: center;margin-top: 20rpx; ">
						<view style="display: flex;justify-content: flex-start;align-items: center;">
							<view>
								<u-image
									src="/static/images/icon/menu-circle.svg"
									width="32rpx"
									height="32rpx"
								></u-image>
							</view>
							<view style="color: #6A707C;font-size: 26rpx;margin-left: 24rpx;">
								{{item.orderid}}
							</view>
						</view>
						<view style="color: #232426 ;font-size: 28rpx;margin-left: 24rpx;font-weight: 510;">
							${{item.price}}
						</view>
					</view>
				</view>
			</view>
			<view v-if="order_list.length == 0">
				<view style="width: 100%;margin-top: 500rpx;">
					<view style="color: #232426;font-size: 28rpx;text-align: center;">目前沒有任何任務</view>
					<view @click="goBack" style="margin: 36rpx auto;border: 2rpx solid #E5E6E8;border-radius: 200rpx;color: #232426;width: 170rpx;height: 50rpx;line-height: 50rpx; text-align: center;font-size: 28rpx;background-color: #FFF;">
						回首頁
					</view>
				</view>
			</view>
		</view>
		<view v-else-if="type == 2 && menu == 1" style="padding: 32rpx 24rpx;" >
			<view v-for="(item, index) in order_list" :key="index">
				<view style="background-color: #FFF;border-radius: 16rpx;padding: 28rpx 32rpx;margin-bottom: 24rpx;" @click="goDetails(item.orderid)">
					<view style="display: flex;justify-content: space-between;align-items: center;">
						<view style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width: 80%;">
							{{item.title}}
						</view>
						<view>
							<view v-if="item.status == 0" style="color: #FFA514;background-color: rgba(255, 165, 20, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == -1" style="color: #6A707C;background-color: #F0F0F0;font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == 1" style="color: #266C9A;background-color: #EDF5FF;font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == 2" style="color: #78C629;background-color: rgba(120, 198, 41, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == 3" style="color: #FFA514;background-color: rgba(255, 165, 20, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else style="color: #378CFC;background-color: rgba(55, 140, 252, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
						</view>
					</view>
					<view style="display: flex;justify-content: flex-start;align-items: center;margin-top: 20rpx; ">
						<view>
							<u-image
								:src="item.avatar"
								width="32rpx"
								height="32rpx"
								radius="50%"
							></u-image>
						</view>
						<view style="font-size: 26rpx;margin-left: 24rpx;color: #6A707C;">{{item.nickname}}</view>
						<view style="color: #F67914;background-color: #FFF0D8;font-size: 24rpx;padding:2rpx 10rpx;border-radius: 52rpx;margin-left: 12rpx;">
							{{item.rate}}
						</view>
					</view>
					<view style="display: flex;justify-content: flex-start;align-items: center;margin-top: 20rpx; ">
						<view>
							<u-icon name="clock" color="#6A707C" size="32rpx"></u-icon>
						</view>
						<view style="margin-left: 24rpx;">
							<view style="color: #6A707C;font-size: 26rpx;">{{item.created_at}}</view>
						</view>
					</view>
					<view style="display: flex;justify-content: space-between;align-items: center;margin-top: 20rpx; ">
						<view style="display: flex;justify-content: flex-start;align-items: center;">
							<view>
								<u-image
									src="/static/images/icon/menu-circle.svg"
									width="32rpx"
									height="32rpx"
								></u-image>
							</view>
							<view style="color: #6A707C;font-size: 26rpx;margin-left: 24rpx;">
								{{item.orderid}}
							</view>
						</view>
						<view style="color: #232426 ;font-size: 28rpx;margin-left: 24rpx;font-weight: 510;">
							${{item.price}}
						</view>
					</view>
					<view style="width: 100%;height: 2rpx;background-color: #F0F0F0;margin: 24rpx 0;"></view>
					<view style="display: flex;justify-content: flex-end;">
						<!-- <view style="border: 2rpx solid #E5E6E8;color: #232426;font-size: 28rpx;padding: 4rpx 40rpx;border-radius: 200rpx;" >私讯</view> -->
						<view v-if="item.status == 5" @click.stop="againOrder(item.fid)" style="border: 2rpx solid #27C5D6;color: #27C5D6;font-size: 28rpx;padding: 4rpx 40rpx;border-radius: 200rpx;" >再次下單</view>
					</view>
				</view>
			</view>
			<view v-if="order_list.length == 0 && type == 2">
				<view style="width: 100%;margin-top: 500rpx;">
					<view style="color: #232426;font-size: 28rpx;text-align: center;">目前沒有任何任務</view>
					<view @click="goBack" style="margin: 36rpx auto;border: 2rpx solid #E5E6E8;border-radius: 200rpx;color: #232426;width: 170rpx;height: 50rpx;line-height: 50rpx; text-align: center;font-size: 28rpx;background-color: #FFF;">
						回首頁
					</view>
				</view>
			</view>
		</view>
		<view v-else style="padding: 32rpx 24rpx;" >
			<view v-for="(item, index) in order_list" :key="index">
				<view style="background-color: #FFF;border-radius: 16rpx;padding: 28rpx 32rpx;margin-bottom: 24rpx;" @click="goDetails(item.orderid)">
					<view style="display: flex;justify-content: space-between;align-items: center;">
						<view style="display: flex;justify-content: flex-start;align-items: center;">
							<view>
								<u-image
									:src="item.avatar"
									width="44rpx"
									height="44rpx"
									radius="50%"
								></u-image>
							</view>
							<view style="font-size: 32rpx;font-weight: 500;margin-left: 12rpx;">{{item.nickname}}</view>
							<view style="color: #F67914;background-color: #FFF0D8;font-size: 24rpx;padding:2rpx 10rpx;border-radius: 52rpx;margin-left: 12rpx;">
								{{item.rate}}
							</view>
						</view>
						<view>
							<!--0待付款，-1已取消，1待确认，2进行中，3待评价，4已完成-->
							<view v-if="item.status == 0" style="color: #FFA514;background-color: rgba(255, 165, 20, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == -1" style="color: #6A707C;background-color: #F0F0F0;font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == 1" style="color: #266C9A;background-color: #EDF5FF;font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == 2" style="color: #78C629;background-color: rgba(120, 198, 41, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else-if="item.status == 3" style="color: #FFA514;background-color: rgba(255, 165, 20, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
							<view v-else style="color: #378CFC;background-color: rgba(55, 140, 252, 0.10);font-size: 24rpx;padding:8rpx 16rpx;border-radius: 8rpx;">{{item.text}}</view>
						</view>
					</view>
					<view style="display: flex;justify-content: flex-start;align-items: center;margin-top: 20rpx; ">
						<view>
							<u-image
								src="/static/images/icon/task.png"
								width="32rpx"
								height="32rpx"
							></u-image>
						</view>
						<view style="margin-left: 24rpx;">
							<view style="color: #6A707C;font-size: 26rpx;width: 440rpx;white-space: nowrap; overflow: hidden;text-overflow: ellipsis">{{item.title}}</view>
						</view>
					</view>
					<view style="display: flex;justify-content: flex-start;align-items: center;margin-top: 20rpx; ">
						<view>
							<u-icon name="clock" color="#6A707C" size="32rpx"></u-icon>
						</view>
						<view style="margin-left: 24rpx;">
							<view style="color: #6A707C;font-size: 26rpx;">{{item.created_at}}</view>
						</view>
					</view>
					<view style="display: flex;justify-content: space-between;align-items: center;margin-top: 20rpx; ">
						<view style="display: flex;justify-content: flex-start;align-items: center;">
							<view>
								<u-image
									src="/static/images/icon/menu-circle.svg"
									width="32rpx"
									height="32rpx"
								></u-image>
							</view>
							<view style="color: #6A707C;font-size: 26rpx;margin-left: 24rpx;">
								{{item.orderid}}
							</view>
						</view>
						<view style="color: #232426 ;font-size: 28rpx;margin-left: 24rpx;font-weight: 510;">
							${{item.price}}
						</view>
					</view>
					<view style="width: 100%;height: 2rpx;background-color: #F0F0F0;margin: 24rpx 0;"></view>
					<view style="display: flex;justify-content: flex-end;">
						<view v-if="item.status == 0" style="border: 2rpx solid #27C5D6;color: #FFF;font-size: 28rpx;padding: 4rpx 40rpx;border-radius: 200rpx;background-color: #27C5D6;" >付款</view>
						<view style="border: 2rpx solid #E5E6E8;color: #232426;font-size: 28rpx;padding: 4rpx 40rpx;border-radius: 200rpx;margin-left: 24rpx;" >私讯</view>
						<view v-if="item.status == 4" style="border: 2rpx solid #27C5D6;color: #27C5D6;font-size: 28rpx;padding: 4rpx 40rpx;border-radius: 200rpx;" >再次下單</view>
					</view>
				</view>
			</view>
			<view v-if="order_list.length == 0">
				<view style="width: 100%;margin-top: 500rpx;">
					<view style="color: #232426;font-size: 28rpx;text-align: center;">目前沒有任何預約</view>
					<view @click="goBack" style="margin: 36rpx auto;border: 2rpx solid #E5E6E8;border-radius: 200rpx;color: #232426;width: 170rpx;height: 50rpx;line-height: 50rpx; text-align: center;font-size: 28rpx;background-color: #FFF;">
						回首頁
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { myOrder,reserveOrder } from '@/config/api.js';
	import { openLineApp } from '@/utils/openApp.js';
	
	export default {
		data() {
			return {
				type:1,//1工作订单，2消费订单
				title:'工作訂單',
				menu:1,//1我的预约，2我的任务
				status:1,//-2已退款, -1已取消，0待付款，1待确认，2待服務，3服務中，4待評價, 5完成
				order_list:[
					{
						id:1,
						avatar:"/static/images/icon/images/Avatar.png",
						nickname:'Jimmy',
						rate:'4.99',
						status:1,
						text:'待確認',
						created_at:'2024/02/24 11:00',
						title:'客製化花束，韓式浪漫氛圍，客製化花客製化花束，韓式浪漫氛圍，客製化花客製化花束，韓式浪漫氛圍，客製化花',
						orderid:'OR100001',
						price:'$10,500'
					}
				],
				page:1,
				max_page:1
			}
		},
		onLoad(option) {
			if(option.type == 2){
				this.title = '消費訂單';
				this.type = 2;
			}
			this.order_list = [];
			this.getLog()
		},
		onPullDownRefresh() {
			console.log('下拉刷新')
			this.page = 1;
			this.order_list = [];
			this.getLog();
			setTimeout(function () {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		onReachBottom(){
			if( this.page <= this.max_page ){
				uni.showLoading({
					icon:'none',
					title:'請求中'
				})
				this.getLog();
			} else {
				console.log('已经到底了')
				uni.showToast({
					icon:'none',
					title:'已經到底了'
				})
			}
		},
		methods:{
			changeMenu(menu){
				this.menu = menu;
				this.page = 1;
				this.order_list = [];
				this.getLog();
			},
			changeStatus(status){
				this.status = status;
				this.page = 1;
				this.order_list = [];
				this.getLog();
			},
			goBack(){
				uni.navigateBack();
			},
			goDetails(id){
				uni.navigateTo({
					url:'/pages/order/details?order_number='+id
				})
			},
			goChat(){
				uni.navigateTo({
					url:'/pages/my/chat'
				})
			},
			getLog(){
				if( this.type == 1 ){
					//获取工作订单
					this.getReserveData();
				} else {
					//获取消费订单
					this.getLogData();
				}
			},
			//获取消费订单
			getLogData(){
				let that = this;
				uni.showLoading({
					title:'加載中..'
				})
				let data = {
					status:this.status,
					type:this.menu,
					page:this.page
				}
				myOrder(data).then((res) => {
					console.log('success', res)
					//success
					if( res.items && res.items.length > 0 ){
						let list = [];
						let log = res.items
						Object.keys(log).forEach(key => {
							console.log( log[key] )
							list.push({
								id:log[key].id,
								fid:log[key].fid,
								avatar:log[key].snapshot.worker.avatar,
								nickname:log[key].snapshot.worker.nickname,
								rate:log[key].snapshot.worker.rate,
								status:log[key].order_status,
								text:log[key].status_text,
								created_at:log[key].created_at,
								title:log[key].title,
								orderid:log[key].order_number,
								price:log[key].amount
							})
						});
						that.order_list = that.order_list.concat(list);
						that.max_page = res.total;
						that.page++;
					}
					uni.hideLoading();
				}).catch((e) =>{
					console.log('error', e)
					uni.hideLoading();
				})
				
			},
			//获取工作订单
			getReserveData(){
				let that = this;
				uni.showLoading({
					title:'加載中..'
				})
				let data = {
					status:this.status,
					type:this.menu,
					page:this.page
				}
				reserveOrder(data).then((res) => {
					console.log('success', res)
					//success
					if( res.items && res.items.length > 0 ){
						let list = [];
						let log = res.items
						Object.keys(log).forEach(key => {
							console.log( log[key] )
							list.push({
								id:log[key].id,
								fid:log[key].fid,
								avatar:log[key].snapshot.worker.avatar,
								nickname:log[key].snapshot.worker.nickname,
								rate:log[key].snapshot.worker.rate,
								status:log[key].order_status,
								text:log[key].status_text,
								created_at:log[key].created_at,
								title:log[key].title,
								orderid:log[key].order_number,
								price:log[key].amount
							})
						});
						that.order_list = that.order_list.concat(list);
						that.max_page = res.total;
						that.page++;
					}
					uni.hideLoading();
				}).catch((e) =>{
					console.log('error', e)
					uni.hideLoading();
				})
				
			},
			openServiceFn(){
				openLineApp()
			},
			againOrder(id){
				uni.navigateTo({
					url:'/pages/content/expert?id='+id
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.warp{
	width: 100%;
	min-height: 100vh;
	background-color: #F6F8FA;
	
	.menu-left{
		border: 2rpx solid #1AAEC0;
		background-color: #FFF;
		color: #1AAEC0;
		padding: 12rpx 120rpx;
		border-radius: 12rpx 0 0 12rpx;
		font-size: 28rpx;
	}
	.menu-left-active{
		border: 2rpx solid #1AAEC0;
		background-color: #1AAEC0;
		color: #fff;
		padding: 12rpx 120rpx;
		border-radius: 12rpx 0 0 12rpx;
		font-size: 28rpx;
	}
	.menu-right{
		border: 2rpx solid #1AAEC0;
		background-color: #FFF;
		color: #1AAEC0;
		padding: 12rpx 120rpx;
		border-radius: 0 12rpx 12rpx 0;
		font-size: 28rpx;
	}
	.menu-right-active{
		border: 2rpx solid #1AAEC0;
		background-color: #1AAEC0;
		color: #fff;
		padding: 12rpx 120rpx;
		border-radius: 0 12rpx 12rpx 0;
		font-size: 28rpx;
	}
	
	.type-item{
		color: #808690;
		font-size: 28rpx;
		line-height: 140%; /* 19.6px */
		letter-spacing: 0.28rpx;
		margin: 8rpx 24rpx;
		padding-bottom: 8rpx;
	}
	.type-item-active{
		color: #1AAEC0;
		font-size: 28rpx;
		line-height: 140%; /* 19.6px */
		letter-spacing: 0.28rpx;
		border-bottom: 4rpx solid #1AAEC0;
		font-weight: 600;
		margin: 8rpx 24rpx;
		padding-bottom: 8rpx;
	}
}
</style>